import React, {FC} from 'react';
import {Menu} from "antd";
import {DetailItem} from "../entity/Summary";

export type RightMenuProps = {
  x: number
  y: number
  onFlatAll: () => void
  onCollapseAll: () => void
  onFlatOne: (node: DetailItem | undefined) => void
  onCollapseOne: (node: DetailItem | undefined) => void
  node: DetailItem | undefined
};

const RightMenu: FC<RightMenuProps> = (props) => {
  const {x, y, onFlatAll, onCollapseAll, onCollapseOne, onFlatOne, node} = props;
  return (
    x !== 0 && y !== 0 ?
      <div style={{
        position: 'absolute',
        top: y - 192,
        left: x - 89,
        zIndex: '100',
        boxShadow: '0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)'
      }}>
        <Menu>
          <Menu.Item key={1} onClick={onFlatAll}>展开全部</Menu.Item>
          <Menu.Item key={2} onClick={onCollapseAll}>收缩全部</Menu.Item>
          <Menu.Item key={3} onClick={e => onFlatOne(node)}>展开当前</Menu.Item>
          <Menu.Item key={4} onClick={e => onCollapseOne(node)}>收缩当前</Menu.Item>
        </Menu>
      </div>
      : null
  );
};

export default RightMenu;
